<!--
 * @Date: 2023-11-16 16:34:29
 * @LastEditors: 春贰
 * @gitee: https://gitee.com/chun22222222
 * @github: https://github.com/chun222
 * @Desc: 
 * @LastEditTime: 2023-11-17 17:39:52
 * @FilePath: \go-ezcode-admin\html\login.html
-->
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" />
    <title>系统登陆
    </title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
    <link rel="stylesheet" title="default" href="./amis-sdk@3.5.2/sdk.css" />
    <link rel="stylesheet" href="./amis-sdk@3.5.2/helper.css" />
    <link rel="stylesheet" href="./amis-sdk@3.5.2/iconfont.css" />
    <script src="./amis-sdk@3.5.2/sdk.js"></script>
    <style>
        /* :root {
    --Page-main-bg : transparent;
} */
        html,
        body,
        .app-wrapper {
            position: relative;
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }

        .login-bg {
            background-image: url(./assets/loginbg.jpg);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        .login-box {
            background: transparent !important;
            background-image: url(./assets/loginbox.png) !important;
            background-size: cover !important;
            background-repeat: no-repeat !important;
            width: 600px;
            height: 300px;
            padding: 10px 80px;
        }
    </style>
</head>

<body>
    <div id="root" class="app-wrapper"></div>
    <script type="module">
        import { isLogin } from "./js/common.js";
        import { baseMenu } from "./layout/menu.js";
        import { leftHeader, rightHeader } from "./layout/header.js";
        import { footer } from "./layout/footer.js";
        (function () {
            let amis = amisRequire('amis/embed');
            // 通过替换下面这个配置来生成不同页面
            let amisJSON = {
                "type": "page",
                "body": {
                    "type": "flex",
                    justify: "center",
                    "alignItems": "center",
                    style: {
                        height: "100%"
                    },
                    className: "login-bg",
                    "items": [
                        {
                            "style": {
                                width: "600px",
                                height: '300px'
                            },
                            className: "login-box",
                            type: "page",
                            body: [
                            {
                                "type": "tpl",
                                "tpl":  "<h2 class='text-center'>系统登录</h2>"
                            },    
                            {
                                type: 'form',
                                mode: 'horizontal',
                                "id": "form_submit",
                                api: '/base/login',
                                className: 'mt-10',
                                wrapWithPanel: false,
                                redirect:"/",
                                body: [
                                    {
                                        label: '用户名',
                                        type: 'input-text',
                                        name: 'username',
                                        "required": true
                                    },
                                    {
                                        label: '密码',
                                        type: 'input-password',
                                        name: 'password',
                                        "required": true
                                    }
                                ]
                            }, {
                                "type": "button",
                                "label": "提交表单",
                                "className": "mb-2 mt-5",
                                level: "primary",
                                block: true,
                                size: "lg",
                                "onEvent": {
                                    "click": {
                                        "actions": [
                                            {
                                                "actionType": "submit",
                                                "componentId": "form_submit",
                                                "outputVar": "form_submit_result"
                                            },
                                            {
                                                "actionType": "setValue",
                                                "componentId": "submit_info",
                                                "args": {
                                                    "value": "${event.data.form_submit_result|json}"
                                                }
                                            }
                                        ]
                                    }
                                }
                            }]
                        },

                    ]
                }
            }

            let amisScoped = amis.embed('#root', amisJSON);
        })();
    </script>
</body>

</html>